<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" 
	xmlns:h="http://java.sun.com/jsf/html" 
	xmlns:f="http://java.sun.com/jsf/core"
    xmlns:ui="http://java.sun.com/jsf/facelets"
    xmlns:a4j="http://richfaces.org/a4j" 
    xmlns:rich="http://richfaces.org/rich">



	<h:head>
		<title>User Registration/Information</title>
		<style type="text/css">
		.errors
		{
			color:red;
			font-size:12px;
		}
		</style>
			<link href="/css/style.css" rel="stylesheet" type="text/css"/>
	</h:head>
	<h:body>
		

		<center>
		<f:view>
		<h:form id="UserForm">
		<h:panelGrid width="580px" columns="2" border="0">
			<rich:panel style="background-color: #ebf3fd;">
				
				<h:inputHidden id="hiddenUserName" value="#{userForm.nomUsuari}"/>
															
		        <h:outputText value="*" style="color:#ff0000;"/>are Mandatory.	 

				<h:panelGrid id="upg" columns="2" border="0" cellspacing="0" cellpadding="0">
			 
					<h:panelGroup> 
						<h:outputText value="First Name" />					
						<h:outputText  value="*" style="color:#ff0000;"/>					
					</h:panelGroup>
					<h:panelGroup>
						<h:inputText id="nom"  value="#{userForm.nom}" styleClass="inputbox"/>
						<h:message for="nom" styleClass="errors"/>
					</h:panelGroup>
					<h:outputText value=""/><h:outputText value=""/>

					<h:panelGroup> 
						<h:outputText value="Last Name" />					
						<h:outputText  value="*" style="color:#ff0000;"/>					
					</h:panelGroup>
					<h:panelGroup>
						<h:inputText id="cognoms"  value="#{userForm.cognoms}" validatorMessage="bad email" styleClass="inputbox">
							<f:validateLength minimum="1" maximum="25"/>                     
							<f:validateRequired />
							<rich:validator /> 
						</h:inputText>
						<rich:message for="cognoms" styleClass="errors"/> 
						
					</h:panelGroup>
					<h:outputText value=""/><h:outputText value=""/>

					<h:panelGroup>
						<h:outputText value="Nombre Usuario (id del login)"/> 
						<h:outputText  value="*" style="color:#ff0000"/> 
					</h:panelGroup>
					<h:panelGroup>
						<h:inputText id="nomUsuari" size="50" disabled="#{userForm.isNomUsuariDisabled}" value="#{userForm.nomUsuari}" styleClass="inputbox"/>
						<h:message for="nomUsuari" styleClass="errors"/>
                    </h:panelGroup>
					<h:outputText value=""/><h:outputText value=""/>

					<h:panelGroup id="pwd">
						<h:outputText value="Password"  /> 
						<h:outputText  value="*" style="color:#ff0000"/> 
					</h:panelGroup>
					<h:panelGroup>
						<h:inputSecret id="password" value="#{userForm.password}" redisplay="true" styleClass="inputbox"/>
						<h:message for="password" styleClass="errors"/>
					</h:panelGroup>
					<h:outputText value=""/><h:outputText value=""/>

					<h:panelGroup>
						<h:outputText value="Confirm Password"  /> 
						<h:outputText  value="*" style="color:#ff0000"/> 
					</h:panelGroup>
					<h:panelGroup>
						<h:inputSecret id="confirmPassword" value="#{userForm.confirmPassword}" redisplay="true" styleClass="inputbox"/>
						<h:message for="confirmPassword" styleClass="errors"/>
					</h:panelGroup>
					<h:outputText value=""/><h:outputText value=""/>
   
					<h:panelGroup>
						<h:outputText value="E-Mail"/> 
						<h:outputText  value="*" style="color:#ff0000"/> 
					</h:panelGroup>
					<h:panelGroup>
						<h:inputText id="email"  size="50" value="#{userForm.email}" validatorMessage="bad email" styleClass="inputbox">
							<f:validateRegex pattern="^(([a-zA-Z0-9_\-\.]+)@([a-zA-Z0-9_\-\.]+)\.([a-zA-Z]{2,5}){1,25})+([;.](([a-zA-Z0-9_\-\.]+)@([a-zA-Z0-9_\-\.]+)\.([a-zA-Z]{2,5}){1,25})+)*$" ></f:validateRegex>                     
							<rich:validator /> 
						</h:inputText>
						<rich:message for="email" styleClass="errors"/> 
						
					</h:panelGroup>
					<h:outputText value=""/><h:outputText value=""/>
					
					<h:panelGroup style="text-valign:top;display:block;height:100%;">
						<h:outputText value="Address" /> 
						<h:outputText  value="*" style="color:#ff0000"/> 
					</h:panelGroup>
					<h:panelGroup>
					<h:inputTextarea id="adreca" rows="8" cols="100"  value="#{userForm.adreca}" styleClass="inputbox"></h:inputTextarea>
					<h:message for="adreca" styleClass="errors"/>
					</h:panelGroup>
					<h:outputText value=""/><h:outputText value=""/>
					
					<h:panelGroup>
						<h:outputText value="Country" />
						<h:outputText  value="*" style="color:#ff0000;"/>
					</h:panelGroup>
					<h:panelGroup>
						<h:inputText id="country" size="50" value="#{userForm.select}" styleClass="inputbox"/>
						<h:message for="country" styleClass="errors"/>						
					</h:panelGroup>
					<h:outputText value=""/><h:outputText value=""/>

					
					<h:panelGroup> 
						<h:outputText value="Contact Number" />
						<h:outputText  value="*" style="color:#ff0000"/> 
					</h:panelGroup> 
					 <h:panelGroup> 
						<h:inputText id="contactNumber" size="50" value="#{userForm.contactNumber}" styleClass="inputbox"/>
						<h:message for="contactNumber" styleClass="errors"/>
					</h:panelGroup>
					<h:outputText value=""/>


                   <h:panelGroup> 
				   <h:outputText value="" />
				    </h:panelGroup> 
                   <h:panelGroup> 
							<h:commandButton value="#{userForm.buttonName}" action="#{userForm.saveUser}" styleClass="submitButton"/>
					</h:panelGroup>
					<h:outputText value=""/><h:outputText value=""/>
					
                   
				
				</h:panelGrid>
			</rich:panel>
			</h:panelGrid>
		</h:form>	
		</f:view>
		</center>
	</h:body>
	
</html>
